<template>
  <div class="execution">
    <basic-container>
      <div class="newspaper-detail-wraper">
        <div class="detail-content">
          <div class="title">{{detailData.title}}</div>
          <div class="detail-cbt">
            作者： {{detailData.editor}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;来源： {{detailData.source}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;时间： {{detailData.createTime}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;浏览量: {{detailData.pv}}
          </div>
          <div class="line"></div>
          <p class="article-br"
          v-html="detailData.content"></p>
          <p>
              文件下载：
              <a class="detail-a" v-for="item in JSON.parse(detailData.files)" :href="item.url" target="_blank">{{item.original}}</a>
          </p>
        </div>
      </div>
    </basic-container>
  </div>
</template>
<script type="text/ecmascript-6">
import {getObj} from '@/api/admin/sysnews'
export default {
  watch: {
    $route (to, from) {
    }
  },
  data () {
    return {
      detailData: {
      }
    }
  },
  created () {
    getObj(this.$route.params.id).then(response => {
        this.detailData = response.data.data
    })
  },
  methods: {

  }
}
</script>

<style lang="scss" scope>
.paginationBox{
  display: flex;
  align-items: center;
  justify-content: center;
}
.newspaper-detail-wraper {
  background: #fff;
  padding: 20px;
  margin-bottom: 20px;
  p {
    font-size: 20px;
    margin-top: 10px;
  }
  .detail-a{
    display: block;
  }
  a:hover {
    color: #2454c2;
    text-decoration: underline;
  }
  .detail-content {
    padding: 60px;
    height: calc(100% - 16px);
    .title {
      color: #000;
      font-size: 30px;
      text-align: center;
      margin-bottom: 20px;
    }
    .detail-cbt {
      color: #999;
      font-size: 15px;
      text-align: center;
    }
    .line {
      height: 2px;
      background: #eee;
      margin: 30px 0;
    }
    .article-br {
      height: calc(100% - 125px);
      overflow-y: auto;
    }
  }
}
</style>

